<?php
//dezend by http://www.yunlu99.com/ QQ:270656184
?><script type="text/javascript" src="/static/js/highcharts/highcharts.js"></script>
<script type="text/javascript" src="/static/js/highcharts/modules/exporting.js"></script>
<script type="text/javascript" src="/static/js/highcharts/modules/data.js"></script>

<style type="text/css">
#main{height:100%;overflow-y:auto;overflow-x:hidden;}
.module{width:100%;background:#fff;}
.module td{padding:20px;width:25%;text-align:center;border:1px solid #eee;}
.module td .fa{font-size:45px;color:#fff;background:#7C7C82;width:70px;height:70px;text-align:center;line-height:70px;border-radius:7px;}
.module td p{margin-top:15px;font-size:15px;}
.module td p span{margin-left:10px;font-size:12px;color:#999;}

.chart{width:100%;background:#eee;border-top:15px solid #eee;}
.chart td{padding:20px;text-align:center;border-left:15px solid #eee;background:#fff;}
.chart td:first-child{border-left:0px;}
</style>
<h1 style="text-align:center;margin:100px;">欢迎来到网站后台管理系统</h1>
<table cellspacing=20 cellpadding=0 border=0 class="module" style="display:none;">
	<tr>
		<td>
			<i class="fa fa-signal"></i>
			<p>交易情况<span>委托量0 | 交易量0</span></p>
		</td>
		<td>
			<i class="fa fa-cart-arrow-down"  style="background:#FF9328;"></i>
			<p>转入转出<span>转入量0 | 转出量0</span></p>
		</td>
		<td>
			<i class="fa fa-money" style="background:#32A3FF;"></i>
			<p>资金情况<span>充值额0 | 提现额0</span></p>
		</td>
		<td>
			<i class="fa fa-user-o" style="background:#70D958;"></i>
			<p>会员情况<span>注册者0 | 充值者0</span></p>
		</td>
	</tr>
</table>
<table cellspacing=0 cellpadding=0 border=0 class="chart" style="display:none;">
	<tr>
		<td width=35%>
			<div id="column" style="width:100%;height:300px;"></div>
		</td>
		<td width=30%>
			<div id="fundchart" style="height:300px;"></div>
		</td>
		<td width=30%>
			<div id="userchart" style="height:300px;"></div>
		</td>
	</tr>
</table>
<table id="datatable" style="display:none;">
	<thead>
		<tr><th></th><th>委托量</th><th>交易量</th></tr>
	</thead>
	<tbody>
		<tr><td>1月</td><td>100.23</td><td>123.95</td></tr>
		<tr><td>2月</td><td>70.23</td><td>57.95</td></tr>
		<tr><td>3月</td><td>29.23</td><td>23.95</td></tr>
		<tr><td>4月</td><td>100.23</td><td>123.95</td></tr>
		<tr><td>5月</td><td>47.23</td><td>13.95</td></tr>
	</tbody>
</table>
<script language="javascript">
$(function(){
	$('#column').highcharts({
		data:{
			table:'datatable'
		},
		chart:{
			type:'column'
		},
		title:{
			text:'交易概况'
		},
		credits:{
			enabled:false
		},
		yAxis:{
			allowDecimals:false,
			title:{
				text:'交易量'
			}
		},
		tooltip:{
			formatter:function(){
				return this.series.name+'<br/>'+this.point.y+' '+this.point.name.toLowerCase();
			}
		}
	});
	$('#fundchart').highcharts({
		chart:{
			plotBackgroundColor:null,
			plotBorderWidth:null,
			plotShadow:false
		},
		title:{
			text:'资金概况'
		},
		credits:{
			enabled:false
		},
		tooltip:{
			pointFormat: '{series.name}: {point.percentage:.1f}%'
		},
		plotOptions:{
			pie:{
				allowPointSelect:true,
				cursor:'pointer',
				dataLabels:{
					enabled:false
				},
				showInLegend:true
			}
		},
		series:[{
			type:'pie',
			name:'资金概况',
			data:[
				['充值',40],
				['提现',10],
				['认购',20],
				['交易',30]
			]
		}]
	});
	$('#userchart').highcharts({
		chart:{
			plotBackgroundColor:null,
			plotBorderWidth:null,
			plotShadow:false
		},
		title:{
			text:'会员概况'
		},
		credits:{
			enabled:false
		},
		tooltip:{
			pointFormat: '{series.name}: {point.percentage:.1f}%'
		},
		plotOptions:{
			pie:{
				allowPointSelect:true,
				cursor:'pointer',
				dataLabels:{
					enabled:false
				},
				showInLegend:true
			}
		},
		series:[{
			type:'pie',
			name:'会员概况',
			data:[
				['实名',60],
				['充值',20],
				['提现',10],
				['其他',10]
			]
		}]
	});
});
</script>